import {Component, EventEmitter, Input, OnInit, Output, ViewEncapsulation} from '@angular/core';
import {EventsService} from "@core/events/events.service";

import {ActivatedRoute, Params, Router} from "@angular/router";
import {ToolsService} from "@shared/service/tools/tools.service";
import {Subject} from "rxjs/Rx";
import {ImageServeService} from "@shared/service/image/image-serve.service";
import {CanReceiveCouponRespVO} from "@interface/index";


@Component({
  selector: 'seed-coupon-card',
  templateUrl: './coupon-card.component.html',
  styleUrls: ['./coupon-card.component.scss'],
  encapsulation: ViewEncapsulation.None,
})
export class CouponCardComponent implements OnInit {
  @Input() coupon: CanReceiveCouponRespVO;
  @Input() markType;
  @Input()
  set url(url: string) {
    this._StateUrl = this.imgService.getCouponStateImg(url);
  }
  get url() {
    return this._StateUrl;
  }
  public _StateUrl: string;
  public hasLogin = false;
  public isActive: number | string = null; // 状态选择序号
  public ngUnsubscribe: Subject<void> = new Subject<void>();
  // tag 标签（1：未使用，2：已使用，4：已过期，5：已作废，6：最新，7：将过期） ,
  public couponStatusList: any = [
    { tag: 1, hash: 'unused'},
    { tag: 2, hash: 'used'},
    { tag: 4, hash: 'overdue'},
    { tag: 5, hash: 'invalid'},
    { tag: 6, hash: 'new'},
    { tag: 7, hash: 'willOverdue'},
  ];
 /** deviceType : 适用平台（1：PC，2：android，3：iOS，4：H5），
 可多选，多个用逗号分隔，“1,2,3,4”代表全平台 ,*/
  public deviceTypes: any = [ '全平台', 'PC', 'Android', 'IOS', 'H5'];
  public deviceTypeList: any = [];

  @Input() choose = false;
  @Output() goToDetail: EventEmitter<any> = new EventEmitter();
  @Output() statusClick: EventEmitter<any> = new EventEmitter();
  constructor(private events: EventsService,
              private route: ActivatedRoute,
              public router: Router,
              public toolsService: ToolsService,
              private imgService: ImageServeService ) {
  }

  /**
   * @description 处理优惠券的不同状态标签
   * @author @zhupw-1360
   * @date 2018-01-04
   * @param tag
   */
  handleTagCouponStatus(tag) {
    this.couponStatusList.forEach((item) => {
      if (item['tag'] === tag) {
        this.url = item['hash'];
      }
    });
  }

  /**
   * @description 点击领取优惠券；
   * @author zhupw1360
   * @params id，i（下标）
   * @date 2017-12-13
   */
  postTakeCoupon(batchId: number) {
    this.statusClick.emit();
  }

  // 跳转优惠劵详情页
  goToCouponDetail(codeId: number) {
    this.choose = true;
    this.goToDetail.emit();
  }

  ngOnInit() {
    this.handleTagCouponStatus(this.coupon.tag);
    this.deviceTypeList = this.coupon.deviceType.split(',') ;
    this.deviceTypeList.unshift('1,2,3,4');
    this.deviceTypeList = [...this.deviceTypes] ;
    if (this.coupon.deviceType = '1,2,3,4') {
      this.deviceTypeList = this.deviceTypes[0];
    }
  }
}
